
<script>
import '@/assets/css/index.scss'
import '@static/font/iconfont.js'
import '@static/font/iconfont.css'
import 'vue2-animate/dist/vue2-animate.min.css'

import Vue from 'vue'
import { mapState, mapMutations } from 'vuex'
import { userUserFindUserInfo, userUserGetChannelByDomain } from '@api/user.js'
import Skeleton from '@/pages/skeleton'
export default {
	name: 'App',
	data() {
		return {
			init: false,
			guide: false,
			USERNAME: localStorage.getItem('USERNAME'),
			PSW: localStorage.getItem('PSW')
		}
	},
	created() {
		const { USERNAME, PSW } = this
		if (USERNAME && USERNAME.length === 11 && PSW && PSW.length >= 6) {
			this.autoLogin() //自动登录成功后会获取四要素与推广信息
		} else {
			//没有自动登录主动获取四要素与推广信息
			this.$store.dispatch('getUserInfo') //查询登录状态，获取个人信息
			this.$store.dispatch('getTopupAuth') //四要素
			this.$store.dispatch('getAgentInfo') //获取推广员信息
		}

		this.$store.dispatch('getChannelInfo') //获取渠道信息
		this.$store.dispatch('getChannelMission') //新手任务
		this.$store.dispatch('getBanners') //banners
		this.$store.dispatch('getVariety').then(res => (this.init = true)) //获取种类
        this.newUserActivity()
	},
	mounted() {},
	components: {
		Skeleton
	},
	computed: {
		...mapState(['channelInfo', 'userInfo'])
	},
	methods: {
		...mapMutations(['setCurVariety']),
		// 下载新包的操作
		channelActivity1() {
			const host = window.location.host
			const channels = ['dl3.', 'dl4.', 'dl5.', 'dl7.', 'dl9.', 'localhost']
			MessageBox({
				title: '金猪送福',
				message: '金猪送福，交易外盘最高送588元',
				confirmButtonText: '立即领取',
				cancelButtonText: '稍候升级',
				showCancelButton: false
			}).then(action => {
				this.$router.push({ path: '/service' })
			})
		},
		autoLogin() {
			const { USERNAME, PSW } = this
			this.$store
				.dispatch('getLogin', {
					userPhone: USERNAME,
					userPass: PSW
				})
				.then(res => {
					this.buttonKey = true
				})
				.catch(e => {
					this.buttonKey = true
				})
		},
		newUserActivity() {
			const { USERNAME, PSW } = this
			if (!USERNAME && !PSW) {
				this.guide = true
			} else {
				this.guide = false
			}
		},
	},
	render() {
		return (
            <div id="app">
				{this.init ? (
					<div>
						<router-view />
						{this.guide ? (
							<div class={'activity'}>
								<div class={'content'}>
									<img
										class={'guide'}
										onClick={() => {
											this.guide = false
											this.$router.push({ path: '/activity/tuiguangreg?abc=1' })
										}}
										src={require('@static/imgs-activity/newuser-jyt.png')}
										alt=""
									/>
									<img class={'close'} onClick={() => (this.guide = false)} src={require('@static/imgs-activity/close.png')} alt="" />
								</div>
							</div>
						) : null}
					</div>
				) : (
					<Skeleton />
                )}
			</div>
		)
	}
}
</script>

<style lang='scss'>
html,
body {
	height: 100%;
}
#app {
	text-align: center;
	color: #333;
	font-size: rem(13px);
	font-family: 'Microsoft YaHei', Arial, Verdana, sans-serif;
	.mint-header .mint-button {
		background-color: #fff;
		margin-left: rem(5px);
	}
	height: 100%;
	> div {
		height: 100%;
	}
}

.activity {
	background-color: rgba($color: #000000, $alpha: 0.5);
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	a {
		display: block;
	}
	.content {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 60%;
		transform: translate(-50%, -50%);
	}
	.close {
		width: 15%;
	}
}
</style>